<script setup lang="ts">
import { getCurrentInstance } from "vue";
import { Button, ClButton, useComponent } from "@chulei-ui/components";
import { Container } from "typedi";
import { ContractService } from "../../../repositories/ContractService";
import ContractSettlementDialog from "../ContractSettlementDialog.vue";
const contractService = Container.get(ContractService);

const props = defineProps<{ contract: any }>();
const instance = getCurrentInstance();
const { createComponent } = useComponent(instance);
const openSettlementDialog = async () => {
  const contract = await contractService.getContract(props.contract.contract_id);
  if (contract) {
    const dialog = createComponent<InstanceType<typeof ContractSettlementDialog>>(ContractSettlementDialog, {
      contract,
      onDestroy() {
        dialog.destroy();
      },
    });
    await dialog.instance!.show();
  }
};

defineOptions({
  name: "ContractSettlementButton",
});
</script>

<template>
  <cl-button
    :size="Button.Size.small"
    :type="contract.settlement_discount ? Button.Type.warning : Button.Type.primary"
    @click="openSettlementDialog"
  >
    <span v-if="contract.settlement_discount">修改</span>结算
  </cl-button>
</template>

<style scoped lang="scss" />
